<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>修改用户信息</title>
    <link rel="stylesheet" th:href="@{/xadmin/css/font.css}"/>
    <link rel="stylesheet" th:href="@{/xadmin/css/xadmin.css}"/>
    <script th:src="@{/xadmin/lib/layui/layui.js}" charset="utf-8"></script>
    <script type="text/javascript" th:src="@{/xadmin/js/xadmin.js}"></script>
</head>
<script>
    layui.config({
        base: '[[@{/xadmin/lib/layui/}]]',
    }).extend({
        excel: 'excel',
    });
</script>
<style>
    #user-view {
        background-color: white;
        margin-top: 5px;
    }
</style>

<body style="margin-top: 20px;">
<div class="x-body">
    <form class="layui-form">
        <div class="layui-form-item">
            <label for="termId" class="layui-form-label">学期</label>
            <div class="layui-input-inline">
                <select name="termId" id="termId" class="show-term-container">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label for="examRate" class="layui-form-label">期末成绩占比</label>
            <div class="layui-input-inline">
                <input type="number" id="examRate" name="examRate" required=""
                       placeholder="10-100"
                       min="10"
                       max="100"
                       lay-verify="required" lay-reqtext="不能为空"
                       value="80"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline" style="line-height: 30px">%</div>
        </div>
        <div class="layui-form-item">
            <label for="moralMaxScore" class="layui-form-label">德育分最高</label>
            <div class="layui-input-inline">
                <input type="number" id="moralMaxScore" name="moralMaxScore" required=""
                       placeholder="0-100"
                       min="0"
                       max="100"
                       lay-verify="required" lay-reqtext="不能为空"
                       value="10"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline" style="line-height: 30px">分</div>
        </div>
        <div class="layui-form-item">
            <label for="moralMaxScore" class="layui-form-label">宿舍分总分</label>
            <div class="layui-input-inline">
                <input type="number" id="apartmentMaxScore" name="apartmentMaxScore" required=""
                       placeholder="0-100"
                       min="0"
                       max="20"
                       lay-verify="required" lay-reqtext="不能为空"
                       value="10"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline" style="line-height: 30px">分</div>
        </div>
        <div class="layui-form-item">
            <label for="lessNo" class="layui-form-label">挂科无奖学金</label>
            <div class="layui-input-block">
                <input type="checkbox" checked="" name="lessNo" lay-skin="switch" lay-filter="switchTest" id="lessNo"
                       lay-text="ON|OFF">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="awardMethod" class="layui-form-label">奖学金计算方式</label>
            <div class="layui-input-inline">
                <select lay-filter="awardMethod" name="awardMethod" id="awardMethod">
                    <option value="rate">百分比</option>
                    <option value="num">个数</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_one" class="layui-form-label">一等</label>
            <div class="layui-input-inline">
                <input type="number" id="L_one" name="one" required=""
                       placeholder="大于0"
                       min="0"
                       value="2"
                       lay-verify="required" lay-reqtext="不能为空"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline level_suffix" style="line-height: 30px">%</div>
        </div>
        <div class="layui-form-item">
            <label for="L_two" class="layui-form-label">二等</label>
            <div class="layui-input-inline">
                <input type="number" id="L_two" name="two" required=""
                       placeholder="大于0"
                       min="0"
                       value="5"
                       lay-verify="required" lay-reqtext="不能为空"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline level_suffix" style="line-height: 30px">%</div>
        </div>
        <div class="layui-form-item">
            <label for="L_three" class="layui-form-label">三等</label>
            <div class="layui-input-inline">
                <input type="number" id="L_three" name="three" required=""
                       placeholder="大于0"
                       min="0"
                       value="10"
                       lay-verify="required" lay-reqtext="不能为空"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline level_suffix" style="line-height: 30px">%</div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <button class="layui-btn" lay-filter="add" lay-submit="">获取表格</button>
        </div>
    </form>
</div>
<script>
    layui.use(['form', 'layer', 'laydate', 'excel'], function () {
        $ = layui.jquery;
        var form = layui.form
            , layer = layui.layer
            , laydate = layui.laydate
            , excel = layui.excel;

        var load = layer.load(1);
        getTerm(function () {
            layui.form.render('select');
            layer.close(load);
        });

        //监听提交
        form.on('submit(add)', function (data) {
            var load = layer.load(2);
            $.ajax({
                url: "/sumScore/get",
                type: "POST",
                data: data.field,
                dataType: 'json',
                success: function (result) {
                    layer.close(load);
                    if (result.code === 500 || result.code === 5000100 || result.code === 5000101 || result.code === 5000102) {
                        layer.alert(result.msg, {icon: 2});
                    } else {
                        result.data.unshift(
                            {
                                "username": "学号",
                                "realName": "姓名",
                                "examScore": "考试成绩",
                                "count": "不及格数量",
                                "apartmentScore": "宿舍分数",
                                "moralScore": "德育分数",
                                "sumScore": "总分",
                                "rank": "排名",
                                "awardRank": "奖学金等级"
                            }
                        )
                        var data = excel.filterExportData(result.data, [
                            "username",
                            "realName",
                            "examScore",
                            "count",
                            "apartmentScore",
                            "moralScore",
                            "sumScore",
                            "rank",
                            "awardRank"
                        ]);
                        excel.exportExcel({
                            sheet1: data
                        }, '综合成绩.xlsx', 'xlsx');
                    }

                }
            });
            return false;
        });

        function getTerm(callback) {
            $.ajax({
                url: "/term",
                type: "GET",
                dataType: 'json',
                success: function (result) {
                    var html = '';
                    if (result.data && result.data.length > 0) {
                        sessionStorage.setItem("termId", result.data[0].id);
                        let termId = result.data[0].id;
                        // console.log(termId);
                        for (var i in result.data) {
                            // console.log(result.data[i].id);
                            if (result.data[i].id == termId) {
                                // console.log("==");
                                html += '<option value="' + result.data[i].id + '" selected="selected">' + result.data[i].name + '</option>';
                            } else
                                html += '<option value="' + result.data[i].id + '">' + result.data[i].name + '</option>';
                        }
                        $(".show-term-container").html(html);
                    }
                    if (callback) {
                        callback();
                    }
                    // console.log(html)
                }
            });
        };

        form.on('select(awardMethod)', function (data) {
            console.log('修改方式');
            if (data.value === 'rate') {
                $('.level_suffix').text('%');
            } else if (data.value === 'num') {
                $('.level_suffix').text('人');
            }
        });
    });

</script>
</body>
</html>